<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--视口介绍  禁止手机端缩放-->
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
    <!--引用bootstrap-->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <!--登陆/注册css-->
    <link rel="stylesheet" href="css/login_register.css">
    <!--滑动验证css-->
    <link rel="stylesheet" href="css/slide-unlock.css">
    <!--jquery核心-->
    <script src="bootstrap/js/jquery-3.2.1.min.js"></script>
    <!--显示/隐藏密码js-->
    <script src="js/jquery.toggle-password.js"></script>
    <!--滑动验证js-->
    <script src="js/jquery.slideunlock.js"></script>
    <!---->
    <script src="js/box_move.js"></script>
    <title>登陆</title>
</head>
<body>
<div class="modal show background col-lg-12" id="loginModal">
    <div class="modal-dialog ">
        <!--设置自适应-->
        <div class="modal-content col-lg-offset-2 col-lg-8 col-sm-8 col-sm-offset-2  col-md-offset-2 col-xs-12  ">
            <div class="modal-header ">
                <button type="button" class="close">&times;</button>
                <h2 class="text-center text-primary">用户登录</h2>
                <div class="modal-body ">
                    <!--表单开始,用于后台数据获取-->
                    <form class="form col-sm-12 center-block " id="loginForm" action="${pageContext.request.contextPath }/logServlet" method="post">
                        <div class="form-group-lg" id="username">
                            <label class="sr-only" for="emailAccount">用户名</label>
                            <!--username地址框-->
                            <div class="input-group">
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-user" aria-hidden="true"></span
                                ></div>
                                <!--表--单--名---accountNo-->
                                <input class="form-control" id="userAccount" name="accountNo" type="text" placeholder="用户名" style="font-size: 14px" required autofocus>
                            </div>
                            <div class="hidden text-center" id="userMsg">
                                <span class="glyphicon glyphicon-exclamation-sign"></span>用户名不存在
                            </div>
                        </div>
                        <br>
                        <!--密码框-->
                        <div class="form-group-lg" id="pwdDiv">
                            <label class="sr-only" for="password">密码</label>
                            <div class="input-group">
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-lock"></span>
                                </div>
                                <!--表--单--名--pwd-->
                                <input class="form-control" id="password" name="pwd" type="password" placeholder="密码" style="font-size: 14px" required>
                                <div class="input-group-addon" id="togglePassword" title="显示密码">
                                    <span class="glyphicon glyphicon-eye-close" id="open"></span>
                                </div>
                            </div>
                            <div class="hidden text-center" id="pwdMsg">
                                <span class="glyphicon glyphicon-exclamation-sign"></span>用户名密码错误
                            </div>
                        </div>
                        <br>

                        <!--验证滑块-->
                        <div class="form-group-lg" id="box_move">
                            <div id="slider">
                                <div id="slider_bg">
                                </div>
                                <span id="label">>></span>
                                <span id="labelTip">拖动滑块验证</span>
                            </div>
                        </div>

                        <!--记住密码/忘记密码-->
                        <div class="form-group" id="forget">
                            <div class="main-checkbox">
                                <input type="checkbox" value="<%%>" id="checkbox1" name="check"/>
                                <label for="checkbox1"></label>
                            </div>
                            <span class="text">记住我</span>
                            
                            <span class="forget"><a href="">忘记密码?</a></span>
                            <br>
                            <br>
                        </div>
                        <!--登陆与注册按钮-->
                        <div class="form-group" id="form_btn">
                            <button class="btn btn-danger btn-lg  col-xs-6 col-md-4" id="btn_register" type="button"><a href="register.jsp" id="register_a">注册</a></button>
                            <button class="btn btn-primary btn-lg col-xs-6 col-md-4" id="btn_login" type="submit">登录</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>